
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <link rel="stylesheet" href="./css/login.css">
    <link rel="stylesheet" href="./css/bootstrap.min.css">
</head>
<body>
    <!-- 登录页面 -->
    <div class="box position-absolute"></div>
    <div class="content container-flex d-flex justify-content-center align-items-center">
        <div class="login d-flex flex-column justify-content-center align-items-center rounded-1">
            <input type="checkbox" name="form-type" id="form-type">
            <div class="form-type-text text-white">
                <span>login</span>
                <span>register</span>
            </div>
            <label for="form-type" class="bg-white rounded-1 position-relative"></label>
            <div class="login-form w-100 h-100 position-relative m-4">
                <form class="form-front w-100 d-flex flex-column align-items-center rounded-1 position-absolute" id="login">
                    <h1 class="text-white">LOG IN</h1>
                    <div class="form-input usernameInput w-100 bg-white position-relative">
                        <input type="text" name="username" placeholder="用户名">
                    </div>
                    <div class="form-input passwordInput w-100 bg-white position-relative">
                       
                        <input class="bg-white" type="password" name="password" placeholder="密码">
                    </div>
                    <p class="text-light"><input type="checkbox" required class="mx-2">我已阅读并同意<a href="#">《服务条款》</a></p>
                    <div class="form-submit w-100">
                        <input type="submit"class="w-100 bg-white" src="" value="登录">
                    </div>
                    
                </form>
                
                <form class="form-back w-100 d-flex flex-column align-items-center rounded-1" id="register">
                    <h1 class="text-white">register</h1>
                    <div class="form-input CusernameInput w-100 bg-white position-relative">
                        
                        <input type="text" name="Cusername" placeholder="用户名为数字组成,6~10位">
                    </div>
                    <div class="form-input CpasswordInput w-100 bg-white position-relative">
                      
                        <input type="password" name="Cpassword" placeholder="密码长度需为6~12位">
                    </div>
                    <div class="form-input Cpassword2Input w-100 bg-white position-relative">
                       
                        <input type="password" name="Cpassword2" placeholder="此次密码需要与上一栏一致">
                    </div>
                    <p class="text-light"><input type="checkbox" required class="mx-2">我已阅读并同意<a href="#">《服务条款》</a></p>
                    <div class="form-submit w-100">
                        <input type="submit" class="w-100 bg-white" value="立即注册">
                    </div>
                </form>
            </div>
            
        </div>
    </div>
    <script src="./js/bootstrap.min.js"></script>
    <script src="./js/jquery-3.1.1.min.js"></script>
    <script src="./js/login.js"></script>
    <script>
       
    </script>
</body>
</html>
